<!doctype html>
<html>
<head>
<meta charset=utf-8"utf-8">
<meta name="viewport"
	content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0, minimal-ui" />
<meta name="format-detection" content="telephone=no" />
<meta name="apple-mobile-web-app-capable" content="yes" />
<title>忘记密码</title>
<script src="../js/public/jquery-1.9.1.min.js" tppabs="http://h5.9188.com/js/public/jquery-1.9.1.min.js"></script>
<script src="../js/public/JQ.md5.js" tppabs="http://h5.9188.com/js/public/JQ.md5.js"></script>
<style type="text/css">

/*msg弹窗*/
@-webkit-keyframes boxfade{0%{opacity:0;}20%{opacity:0.8;}80%{opacity:0.8;}100%{opacity:0;}}
@-o-keyframes boxfade{0%{opacity:0;}20%{opacity:0.8;}80%{opacity:0.8;}100%{opacity:0;}}
@-ms-keyframes boxfade{0%{opacity:0;}20%{opacity:0.8;}80%{opacity:0.8;}100%{opacity:0;}}
.alertBox{font-size:15px;text-align: center;border-radius:5px;position: fixed;left:50%;top:50%;margin:-20px 0 0 -150px;background:#000;color:#fff;width:300px;height:40px;line-height:40px;-webkit-animation:boxfade 2s ease;-ms-animation:boxfade 2s ease;-o-animation:boxfade 2s ease; z-index:10001}
/*遮罩层*/
.mask{background:#000;opacity:0.4;width:100%;height:150%;position:fixed;z-index:9999;left:0;top:0; display: none;}

.weui-vcode-img{width:90px;height:40px;}
</style>
<link rel="stylesheet" href="../style/weui.css" tppabs="http://h5.9188.com/style/weui.css"/>
<link rel="stylesheet" href="../style/example.css" tppabs="http://h5.9188.com/style/example.css"/>
<body>
	<article>
	<section class="page__hd">

    <div class="weui-flex">
      <a class="weui-cell__back" href="javascript:history.back()"></a>
      <p class="weui-flex__item txt_center">忘记密码</p>
    </div>    
  </section>
  <section class="page__bd">
  	<div id='wangji'>   
    <div class="weui-cells weui-cells_form">
      <div class="weui-cell weui-cell_vcode">
          <div class="weui-cell__hd"><label class="weui-label">图形码</label></div>
          <div class="weui-cell__bd">
              <input id='yzmpic' class="weui-input" type="text" placeholder="请输入图形码" maxlength =10/>
          </div>
          <div class="weui-cell__ft">
              <img class="weui-vcode-img" src="../img.jo.jpg" tppabs="http://h5.9188.com/img.jo" />
          </div>
      </div>
      <div class="weui-cell">
          <div class="weui-cell__hd">
              <label class="weui-label">用户名</label>
          </div>
          <div class="weui-cell__bd">
              <input id=username class="weui-input" type="text" placeholder="请输入用户名">
          </div>          
      </div>
      <div class="weui-cell">
          <div class="weui-cell__hd">
              <label class="weui-label">手机号</label>
          </div>
          <div class="weui-cell__bd">
              <input class="weui-input" id='mobile' type="tel" placeholder="用户名绑定的手机号码" maxlength =11>
          </div>          
      </div>
      <div class="weui-cell weui-cell_vcode">
          <div class="weui-cell__hd">
              <label class="weui-label">验证码</label>
          </div>
          <div class="weui-cell__bd">
              <input class="weui-input" id='yzm' type="text" placeholder="请输入验证码" maxlength =8>
          </div>
          <div class="weui-cell__ft">
              <button class="weui-vcode-btn" id='hyzm'>获取验证码</button>
          </div>
      </div>
    </div>
    <div class="weui-btn-area">
      <button class="weui-btn weui-btn_disabled weui-btn_primary" disabled='true' id="btn_tj">下一步</button>
    </div>
    </div>
    
    <!-- 重新输入密码 -->
    <div id='chongz' style='display:none'>
    <div class="weui-cells weui-cells_form">      
      <div class="weui-cell">
          <div class="weui-cell__hd">
              <label class="weui-label">新密码</label>
          </div>
          <div class="weui-cell__bd my_icon_box">
              <input class="weui-input" id='pwd' type="password" placeholder="请输入新密码" maxlength =20>
          </div>         
      </div>
      <div class="weui-cell">
          <div class="weui-cell__hd">
              <label class="weui-label">确认密码</label>
          </div>
          <div class="weui-cell__bd my_icon_box">
              <input class="weui-input" id='repwd' type="password" placeholder="请再次输入新密码" maxlength =20>
          </div>         
      </div>
    </div>
    <div class="weui-btn-area" >
      <button class="weui-btn weui-btn_primary weui-btn_disabled" disabled='true' id="btn_tj2">完成</button>
    </div>
    </div>
  </section>
  </article> 
<script>
//公用弹出层和加载层
var win_alert = alert;
window['alert'] = function (msg, loading) {
	if (!loading) {
		clearTimeout(window.alert.time);
		var obj = $('<div class="alertBox">' + msg + '</div>');
		$('body').append(obj);
		window.alert.time = setTimeout(function () {
			$(".alertBox").remove();
		}, 2000);
	} else {
		$('body').append($('<div class="alertBox"><div class="box_loading"><div class="loading_mask"></div></div>' + msg + '</div>'));
		$('.alertBox').css({"webkitAnimationName": "boxfade_loading", "opacity": 0.8});
		$('#mask').show();
	}
};

var remove_alert = function () {
	$('.alertBox').remove();
	$('#mask').hide();
};


$(function () {
	var wait=60;
	var name = localStorage.getItem("username") || '';
	$("#username").val(name);
	var mobile = '';
	$("#btn_tj").click(function(){
		mobile = $('#mobile').val().replace(/['\t]/g,'').replace(/\s*/g, '');
		if($("#username").val() !="" && $("#username").length <= 32 ){
			if(!(/^1[34578]\d{9}$/.test(mobile))){
				alert("请输入有效手机号码");
				return false;
			}
			tjyzm();
		}else{
			alert('请输入有效用户名')
			return false;
		}
	});
	$('#hyzm').click(function(){
		mobile = $('#mobile').val().replace(/['\t]/g,'').replace(/\s*/g, '');
		if($('#yzmpic').val()){
			if($("#username").val() !="" && $("#username").length <= 32 ){
				if(!(/^1[34578]\d{9}$/.test(mobile))){
					alert("请输入有效手机号码");
					return false;
				}
				checkUserForm();
			}else{
				alert('请输入有效用户名');
				return false;
			}
		}else{
			alert('请输入图形验证码');
			return false;
		}
		
	})
	
	$(".weui-cell__ft").on("click",function(){
		$(this).find("img").attr("src","/img.jo?"+Math.random())
	})
	$('#btn_tj2').click(function(){
		repwd();
	})
	
	//获取验证码方法
	var cont = 60;
	var getyzmCode = function(){
		mobile = $('#mobile').val().replace(/['\t]/g,'').replace(/\s*/g, '');
		var imNo = mobile;
		var stime = new Date().getTime();
		var get_yzm_data={
				mobileNo:mobile,
				yzm: $("#yzmpic").val(),
				newValue: 1,
				flag: 1,
				uid: $('#username').val(),
				imNo: imNo,
				stime: stime,
				signmsg: $.md5("imNo="+imNo+'&timestamp='+stime+'&key='+'1.0^adhfjkas565a4sdf36a4s6df46^'),
				source: 3002
			};
		$.ajax({
			url : "http://h5.9188.com/user/sendSms.go",
			type : "POST",
			dataType : "xml",
			data : get_yzm_data,
			success : function(xml) {
				var R = $(xml).find("Resp");
				var code = R.attr("code");
				var desc = R.attr("desc");
				if (code == "0") {
					var r = R.find("row");
					var m = r.attr('mobileNo');
					countDown()
				}else{
					//$('.weui-cell__ft').find("img").attr("src","/img.jo?"+Math.random());
					alert(desc);
				}
			},
		});
	}
	
	//提交验证码获取密码
	var tjyzm = function(){
		mobile = $('#mobile').val().replace(/['\t]/g,'').replace(/\s*/g, '');
		var data ="mobileNo=" + mobile+"&yzm=" + $("#yzm").val()+"&tid=1";
		$.ajax({
			url : "http://h5.9188.com/user/verifySms.go",
			type : "POST",
			dataType : "xml",
			data : data,
			success : function(xml) {
				var R = $(xml).find("Resp");
				var code = R.attr("code");
				var desc = R.attr("desc");
				if (code == "0") {
					$('#chongz').show();
					$('#wangji').hide();
					$('.txt_center').html('设置密码');
				}else{
					/* $('.weui-cell__ft').find("img").attr("src","/img.jo?"+Math.random()); */
					alert(desc)
				}
			}
		});
	}
	//检查用户名是否存在
	var checkUserForm = function(){
		mobile = $('#mobile').val().replace(/['\t]/g,'').replace(/\s*/g, '');
		if($('#username').val()){
			var data ="uid=" + encodeURIComponent($("#username").val())+'&mobileNo='+mobile+'&mtype=4'+'&appversion=4.0.0'+'&source=3002';
			$.ajax({
				url : "http://h5.9188.com/user/forgetpwd.go",
				type : "POST",
				dataType : "xml",
				data : data,
				success : function(xml) {
					var R = $(xml).find("Resp");
					var code = R.attr("code");
					var desc = R.attr("desc");
					if (code == '0') {//用户名存在
						getyzmCode();
					}else{
						//$('.weui-cell__ft').find("img").attr("src","/img.jo?"+Math.random());
						alert(desc);
						return false
					}	
				}
			});
		}
	}
	//重置密码
	var repwd = function(){
		var pw = /^(?![0-9]+$)(?![a-zA-Z]+$)[0-9A-Za-z]{6,20}$/g;
		if(($('#pwd').val() == $('#repwd').val()) && $('#pwd').val() && $('#repwd').val()){
			if(pw.test($('#pwd').val())){
			if($("#username").val() == $("#pwd").val()){
				alert('用户名和密码不可以一致')
			}else{
				var jmyz = 'http://www.9188.com/'
					var data = 'pwd='+$.md5($('#pwd').val()+jmyz)
							+'&confupwd='+$.md5($('#repwd').val()+jmyz)
							+'&uid='+encodeURIComponent($('#username').val())
							+'&flag=0'+'&signmsg='+$.md5($.md5($('#repwd').val()+jmyz)+'A9FK25RHT487ULMI');
					
					$.ajax({
						url : "http://h5.9188.com/user/setNewPwd.go",
						dataType : "xml",
						type:"POST",
						data:data,
						success : function(xml) {
							var R = $(xml).find("Resp");
							var desc = R.attr("desc");
							var code = R.attr("code");
							if(code == 0){
								location.href='forsucces.html'/*tpa=http://h5.9188.com/alone/forsucces.html*/;
							}else{
								alert(desc);
							}
						}
					});
				}	
			}else{
				alert('密码6-20位字母、数字的组合')
			}
		}else{
			alert('两个密码输入不一致')
		}
	}

	var countDown= function(){
		if(wait == 0){
			$("#hyzm").removeAttr("disabled");			
			$("#hyzm").html("重新发送");
			$('.weui-cell__ft').find("img").attr("src","/img.jo?"+Math.random())
			wait = 60;
		}else{
			$("#hyzm").attr("disabled", true);
			$("#hyzm").html("重新发送(" + wait + ")");
			wait--;
			setTimeout(function() {
				countDown();
			}, 1000);
			
		}
	}
	
	//重新发送验证码
	function zeroDownAjax(){
		var data ="uid=" + encodeURIComponent($("#username").val())+"&flag=1"+"&mtype=4";
		$.ajax({
			url : "http://h5.9188.com/user/usergetpwd.go",
			dataType : "xml",
			data:data,
			success : function(xml) {
				var R = $(xml).find("Resp");
				var desc = $(R).attr("desc");
				alert(desc);
			}
		});
	}
	
	$("#yzmpic").keyup(function(){
		btnLight(1)
	});
	$("#username").keyup(function(){
		btnLight(1)
	});
	$("#mobile").keyup(function(){
		btnLight(1)
	});
	$("#yzm").keyup(function(){
		btnLight(1)
	});
	$("#pwd").keyup(function(){
		btnLight(2)
	});
	$("#repwd").keyup(function(){
		btnLight(2)
	});
	
	//按钮点亮
	var btnLight = function(a){
		if(a == 1){
			if($('#yzmpic').val() && $('#username').val() && $("#mobile").val() && $("#yzm").val()){
		    	$('#btn_tj').removeClass('weui-btn_disabled');
		    	$('#btn_tj').removeAttr('disabled');
		    }else{
		    	if(!($('#btn_tj').hasClass('weui-btn_disabled'))){
		    		$('#btn_tj').addClass('weui-btn_disabled')
		    		$('#btn_tj').attr('disabled','true');
		    	}
		    }
		}else if(a == 2){
			if($('#repwd').val() && $('#pwd').val()){
		    	$('#btn_tj2').removeClass('weui-btn_disabled');
		    	$('#btn_tj2').removeAttr('disabled');
		    }else{
		    	if(!($('#btn_tj2').hasClass('weui-btn_disabled'))){
		    		$('#btn_tj2').addClass('weui-btn_disabled')
		    		$('#btn_tj2').attr('disabled','true');
		    	}
		    }
		}
	}
	//按钮点亮
});
</script>
</body>
</html>